<template>
  <span
    class="com-spliter-line"
    :class="{'is-row': isRow}"
    :style="{background: color, width: isRow ? size : '1px', height: isRow ? '1px' : size, margin: isRow ? margin + ' 0' : '0 ' + margin}"
  ></span>
</template>

<script>
export default {
  props: {
    color: {
      type: String,
      default: "#E6EAEE"
    },
    isRow: {
      type: Boolean,
      default: false
    },
    size: {
      type: [String, Number],
      default: "100%"
    },
    margin: {
      type: [String, Number],
      default: 0
    }
  }
};
</script>

<style lang="scss" scoped>
.com-spliter-line {
  width: 1px;
  height: 100%;
}
.is-row {
  width: 100%;
  height: 1px;
}
</style>
